<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <meta http-equiv="Cache-Control" content="no-cache"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>

  <title>WebGL 流体模拟</title>

  <link rel="icon" type="image/png" href="logo.png"/>

  <style>
    @font-face {
      font-family: "iconfont";
      src: url("iconfont.ttf") format("truetype");
    }

    * {
      user-select: none;
    }

    html,
    body {
      overflow: hidden;
      background-color: #000;
    }

    body {
      margin: 0;
      position: fixed;
      width: 100%;
      height: 100%;
    }

    canvas {
      width: 100%;
      height: 100%;
    }

    .dg {
      opacity: 0.9;
    }

    .dg .property-name {
      overflow: visible;
    }

    .bigFont {
      font-size: 150%;
      color: #8C8C8C;
    }

    .cr.function.appBigFont {
      font-size: 150%;
      line-height: 27px;
      color: #A5F8D3;
      background-color: #023C40;
    }

    .cr.function.appBigFont .property-name {
      float: none;
    }

    .icon {
      font-family: "iconfont";
      font-size: 130%;
      float: right;
    }

    .cr.function.appBigFont .icon {
      position: sticky;
      bottom: 27px;
    }

    .github:before {
      content: 'b';
    }

    .twitter:before {
      content: 'a';
    }

  </style>
</head>

<body>
<canvas></canvas>

<script type="text/javascript" src="dat.gui.js"></script>
<script src="script.js"></script>
</body>
</html>
